.login-page {
    height: 100%;
    position: relative;
    &:after {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: block;
        content: '';
        background: linear-gradient(180deg, #282828 0, #111);
        opacity: 0.9;
    }
    .login-box {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10;
    }
    .login-form {
        width: 500px;
        padding: 16px 80px 48px 80px;
        background-color: rgba(255, 255, 255, 0.8);
        border-radius: $--border-radius-base;
        box-shadow: 3px 8px 25px rgba(0, 0, 0, 0.8);
        color: #000;

        .el-form-item--large {
        	.el-form-item__content{
        		line-height: 50px;
        	}
            .el-input__inner {
                height: 50px;
            }
			.el-form-item__content,
			.el-input__inner,
            .el-input__prefix .ion{
            	font-size: 16px;
            }
            .el-input--prefix .el-input__inner{
            	padding-left: 64px;
            }
            .el-input__prefix{
            	width: 48px;
            	border-right: #ddd solid 1px;
            }
        }
    }
    .login-submit {
        width: 240px;
    }
    .login-page-header,
    .login-page-footer {
        position: absolute;
        left: 0;
        width: 100%;
        height: 80px;
        color: rgba(255, 255, 255, 0.6);
        z-index: 12;
        padding: 16px 64px;
        a {
            color: #fff;
            text-decoration: none;
        }
    }
    .login-page-header {
        top: 0;
        font-size: 18px;
    }
    .login-page-footer {
        bottom: 0;
    }
    .navbar-header {
        height: 64px;
        width: 100%;
        .logo {
            height: 100%;
            line-height: 64px;
            font-size: 24px;
        }
    }
}
